import {
  Input,
  Switch,
  Radio,
  Number,
  InputNumber,
  Checkbox,
  Select,
  Multiple,
  Options,
  Date,
  DateRange,
  DateTime,
  DateTimeRange,
  Time,
  Notes,
  Line,
  Drawboard,
  Editor,
  UploadFile,
  UploadFiles,
  UploadImage,
  Area,
  Address,
  Color,
  Slider,
  Link
} from '../widget'
import { BasicOption } from './basicops'
import Types from '../../workflow/common/types'
import { formatDate } from '@/utils/helper'
import { randomString } from '@/utils'
const Fields = {
  input() {
    return {
      target: Input,
      parameter: {
        mold: 'field',
        label: '文本框',
        placeholder: '文本框',
        value: ''
      },
      option: [
        { title: '基础配置', fields: BasicOption() },
        {
          title: '附加配置', fields: [
            {
              type: Radio, option: {
                name: 'type',
                label: '类型',
                type: 'default',
                list: [
                  { name: '单行', value: 'text' },
                  { name: '多行', value: 'textarea' }
                ],
                layout: 'horizon',
                value: 'text'
              }
            },
            {
              type: Input, option: {
                label: '正则表达式', name: 'regx', required: false, checker(a) {
                  try {
                    new RegExp(a)
                    return { result: true }
                  } catch (e) {
                    return { result: false, msg: '无效正则表达式' }
                  }
                }
              }
            }
          ]
        }
      ],
      valueType: Types.VALUETYPES.STRING,
      format(a) {
        return a
      }
    }
  },
  switch() {
    return {
      target: Switch,
      parameter: {
        mold: 'field',
        label: '开关',
        placeholder: '开关',
        value: false
      },
      option: [
        { title: '基础配置', fields: BasicOption() }
      ],
      valueType: Types.VALUETYPES.BOOLEAN,
      format(a) {
        return a
      }
    }
  },
  radio() {
    return {
      target: Radio,
      parameter: {
        mold: 'field',
        label: '单选选项',
        placeholder: '',
        value: '',
        list: [
          { name: '选项1', value: '1' },
          { name: '选项2', value: '2' },
          { name: '选项3', value: '3' }
        ]
      },
      option: [
        { title: '基础配置', fields: BasicOption() },
        {
          title: '附加配置', fields: [
            {
              type: Select, option: {
                label: '显示形式',
                name: 'type',
                list: [
                  { name: '默认', value: 'default' },
                  { name: '按钮', value: 'button' }
                ],
                value: 'default'
              }
            },
            {
              type: Select, option: {
                label: '显示方式', name: 'layout',
                list: [
                  { name: '水平显示', value: 'horizon' },
                  { name: '垂直显示', value: 'vertical' }
                ],
                value: 'horizon'
              }
            },
            {
              type: Options, option: {
                label: '选项', name: 'list', value: [
                  { name: '选项1', value: '1' },
                  { name: '选项2', value: '2' },
                  { name: '选项3', value: '3' }
                ]
              }
            }
          ]
        }
      ],
      format(value, option) {
        const t = (option.list || []).find(a => a.value == value)
        if (t) {
          return t.name
        } else {
          return ''
        }
      },
      valueType: Types.VALUETYPES.RADIOSTRING
    }
  },
  inputnumber() {
    return {
      target: InputNumber,
      parameter: {
        mold: 'field',
        label: '计数器',
        placeholder: '计数器',
        value: ''
      },
      option: [
        { title: '基础配置', fields: BasicOption() },
        {
          title: '附加配置', fields: [
            { type: InputNumber, option: { label: '最大值', name: 'max', value: 100, required: false, max: 200, min: 0, percision: 0 }},
            { type: InputNumber, option: { label: '最小值', name: 'min', value: 0, required: false, max: 100, min: 0, percision: 0 }},
            { type: InputNumber, option: { label: '保留小数位数', name: 'percision', value: 0, required: false, max: 10, min: 0, percision: 0 }},
            { type: InputNumber, option: { label: '计数器步长', name: 'step', value: 1, required: false, percision: 0 }},
            { type: Switch, option: { label: '是否显示控制按钮', name: 'controls', value: true, activetext: '是', inactivetext: '否' }},
            {
              type: Radio, option: {
                label: '按钮显示位置', name: 'position', type: 'default', list: [
                  { name: '两侧', value: '' },
                  { name: '右侧', value: 'right' }
                ],
                layout: 'horizon',
                value: ''
              }
            }
          ]
        }
      ],
      valueType: Types.VALUETYPES.NUMBER,
      format(a) {
        return a
      }
    }
  },
  number() {
    return {
      target: Number,
      parameter: {
        mold: 'field',
        label: '数值',
        placeholder: '数值',
        value: ''
      },
      option: [
        { title: '基础配置', fields: BasicOption() },
        {
          title: '附加配置', fields: [
            { type: InputNumber, option: { label: '最大值', name: 'max', value: 100, required: false, max: 200, min: 0, percision: 0 }},
            { type: InputNumber, option: { label: '最小值', name: 'min', value: 0, required: false, max: 100, min: 0, percision: 0 }},
            { type: InputNumber, option: { label: '保留小数位数', name: 'percision', value: 0, required: false, max: 10, min: 0, percision: 0 }},
            { type: Input, option: { label: '单位', name: 'slot', value: '', required: false }}
          ]
        }
      ],
      valueType: Types.VALUETYPES.NUMBER,
      format(a) {
        return a
      }
    }
  },
  select() {
    return {
      target: Select,
      parameter: {
        mold: 'field',
        label: '下拉单选',
        placeholder: '下拉单选',
        value: '',
        list: [
          { name: '选项1', value: '1' },
          { name: '选项2', value: '2' },
          { name: '选项3', value: '3' }
        ]
      },
      option: [
        { title: '基础配置', fields: BasicOption() },
        {
          title: '附加配置', fields: [
            { type: Switch, option: { label: '是否可搜索', name: 'filterable', value: true, activetext: '是', inactivetext: '否' }},
            { type: Switch, option: { label: '是否可清除', name: 'clearable', value: true, activetext: '是', inactivetext: '否' }},
            {
              type: Options, option: {
                label: '选项', name: 'list', value: [
                  { name: '选项1', value: '1' },
                  { name: '选项2', value: '2' },
                  { name: '选项3', value: '3' }
                ]
              }
            }
          ]
        }
      ],
      valueType: Types.VALUETYPES.RADIOSTRING,
      format(a, option) {
        return option.list.find(c => c.value == a).name
      }
    }
  },
  checkbox() {
    return {
      target: Checkbox,
      parameter: {
        mold: 'field',
        label: '多选选项',
        placeholder: '',
        value: [],
        list: [
          { name: '选项1', value: '1' },
          { name: '选项2', value: '2' },
          { name: '选项3', value: '3' }
        ]
      },
      option: [
        { title: '基础配置', fields: BasicOption() },
        {
          title: '附加配置', fields: [
            {
              type: Select, option: {
                label: '显示形式',
                name: 'type',
                list: [
                  { name: '默认', value: 'default' },
                  { name: '按钮', value: 'button' }
                ],
                value: 'default'
              }
            },
            {
              type: Select, option: {
                label: '显示方式', name: 'layout',
                list: [
                  { name: '水平显示', value: 'horizon' },
                  { name: '垂直显示', value: 'vertical' }
                ],
                value: 'horizon'
              }
            },
            {
              type: Options, option: {
                label: '选项', name: 'list', value: [
                  { name: '选项1', value: '1' },
                  { name: '选项2', value: '2' },
                  { name: '选项3', value: '3' }
                ]
              }
            }
          ]
        }
      ],
      valueType: Types.VALUETYPES.ENUMSTRING,
      format(a, option) {
        return a.map(b => {
          return option.list.find(c => c.value === b).name
        }).join(',')
      }
    }
  },
  multiple() {
    return {
      target: Multiple,
      parameter: {
        mold: 'field',
        label: '下拉多选',
        placeholder: '下拉多选',
        value: [],
        list: [
          { name: '选项1', value: '1' },
          { name: '选项2', value: '2' },
          { name: '选项3', value: '3' }
        ]
      },
      option: [
        { title: '基础配置', fields: BasicOption() },
        {
          title: '附加配置', fields: [
            { type: Switch, option: { label: '是否可搜索', name: 'filterable', value: true, activetext: '是', inactivetext: '否' }},
            { type: Switch, option: { label: '是否可清除', name: 'clearable', value: true, activetext: '是', inactivetext: '否' }},
            {
              type: Options, option: {
                label: '选项', name: 'list', value: [
                  { name: '选项1', value: '1' },
                  { name: '选项2', value: '2' },
                  { name: '选项3', value: '3' }
                ]
              }
            }
            // {
            //   type: Extend, option: {
            //     label: '选项', name: 'list', initalize: true, fields: [
            //       { type: Input, option: { label: '选项名', name: 'name', required: true } },
            //       { type: Input, option: { label: '选项值', name: 'value', required: true } }
            //     ]
            //   }
            // }
          ]
        }
      ],
      valueType: Types.VALUETYPES.ENUMSTRING,
      format(a, option) {
        return a.map(b => {
          return option.list.find(c => c.value === b).name
        }).join(',')
      }
    }
  },
  date() {
    return {
      target: Date,
      parameter: {
        mold: 'field',
        label: '日期',
        placeholder: '日期',
        value: ''
      },
      option: [
        { title: '基础配置', fields: BasicOption() },
        {
          title: '附加配置', fields: [
            {
              type: Select, option: {
                label: '显示形式',
                name: 'format',
                list: [
                  { name: 'yyyy-MM-dd', value: 'yyyy-MM-dd' },
                  { name: 'yyyy年MM月dd日', value: 'yyyy年MM月dd日' }
                ],
                value: 'yyyy-MM-dd'
              }
            },
            { type: Switch, option: { label: '是否开启日期限制', name: 'rangeOpen', value: false, activetext: '是', inactivetext: '否' }},
            { type: Date, option: { label: '起始日期', name: 'rangeBefore', description: '该日期前不可用' }},
            { type: Date, option: { label: '结束日期', name: 'rangeAfter', description: '该日期后不可用' }}
          ]
        }
      ],
      valueType: Types.VALUETYPES.DATE,
      format(a) {
        if (a) {
          return formatDate(new Date(+a), `yyyy-MM-dd`)
        } else {
          return '--'
        }
      }
    }
  },
  daterange() {
    return {
      target: DateRange,
      parameter: {
        mold: 'field',
        label: '日期区间',
        startplaceholder: '开始日期',
        endplaceholder: '结束日期',
        value: []
      },
      option: [
        {
          title: '基础配置', fields: [
            { type: Input, option: { label: '标题', name: 'label', required: true }},
            { type: Input, option: { label: 'name', name: 'name', required: false, value: `A${randomString(8)}`, notice: '域名称,可用于关于数据的其他处理', tip: '如不清楚如何设置,请保持现状' }},
            { type: Input, option: { label: '起始占位内容', name: 'startplaceholder' }},
            { type: Input, option: { label: '结束占位内容', name: 'endplaceholder' }},
            { type: Switch, option: { label: '是否必填', name: 'required', value: false, activetext: '是', inactivetext: '否' }},
            { type: Switch, option: { label: '是否禁用', name: 'disabled', value: false, activetext: '是', inactivetext: '否' }},
            { type: Input, option: { label: '非空提示', name: 'requiredErrorMsg', value: '必填选项不能为空', description: '当必填选项为空时的提示' }},
            { type: Input, option: { label: '底部提示', name: 'description', description: '在组件此处显示' }}
          ]
        },
        {
          title: '附加配置', fields: [
            {
              type: Select, option: {
                label: '显示形式',
                name: 'format',
                list: [
                  { name: 'yyyy-MM-dd', value: 'yyyy-MM-dd' },
                  { name: 'yyyy年MM月dd日', value: 'yyyy年MM月dd日' }
                ],
                value: 'yyyy-MM-dd'
              }
            },
            { type: Switch, option: { label: '是否开启日期限制', name: 'rangeOpen', value: false, activetext: '是', inactivetext: '否' }},
            { type: Date, option: { label: '起始日期', name: 'rangeBefore', description: '该日期前不可用' }},
            { type: Date, option: { label: '结束日期', name: 'rangeAfter', description: '该日期后不可用' }}
          ]
        }
      ],
      valueType: Types.VALUETYPES.DATE,
      format(a) {
        if (a) {
          const [s, e] = a
          return `${formatDate(new Date(+s), `yyyy-MM-dd`)} ~ ${formatDate(new Date(+e), `yyyy-MM-dd`)}`
        } else {
          return '--'
        }
      }
    }
  },
  datetime() {
    return {
      target: DateTime,
      parameter: {
        mold: 'field',
        label: '日期时间',
        placeholder: '日期时间',
        value: ''
      },
      option: [
        { title: '基础配置', fields: BasicOption() },
        {
          title: '附加配置', fields: [
            {
              type: Select, option: {
                label: '显示形式',
                name: 'format',
                list: [
                  { name: 'yyyy-MM-dd HH:mm:ss', value: 'yyyy-MM-dd HH:mm:ss' },
                  { name: 'yyyy年MM月dd日 HH时mm分ss秒', value: 'yyyy年MM月dd日 HH时mm分ss秒' }
                ],
                value: 'yyyy-MM-dd HH:mm:ss'
              }
            },
            { type: Switch, option: { label: '是否开启日期限制', name: 'rangeOpen', value: false, activetext: '是', inactivetext: '否' }},
            { type: DateTime, option: { label: '起始日期', name: 'rangeBefore', description: '该日期前不可用' }},
            { type: DateTime, option: { label: '结束日期', name: 'rangeAfter', description: '该日期后不可用' }}
          ]
        }
      ],
      valueType: Types.VALUETYPES.DATETIME,
      format(a) {
        if (a) {
          if (a.indexOf('-') !== -1) {
            return a
          } else {
            return formatDate(new Date(+a), `yyyy-MM-dd HH:mm:ss`)
          }
        } else {
          return '--'
        }
      }
    }
  },
  datetimerange() {
    return {
      target: DateTimeRange,
      parameter: {
        mold: 'field',
        label: '日期时间',
        startplaceholder: '开始日期',
        endplaceholder: '结束日期',
        value: []
      },
      option: [
        {
          title: '基础配置', fields: [
            { type: Input, option: { label: '标题', name: 'label', required: true }},
            { type: Input, option: { label: 'name', name: 'name', required: false, value: `A${randomString(8)}`, notice: '域名称,可用于关于数据的其他处理', tip: '如不清楚如何设置,请保持现状' }},
            { type: Input, option: { label: '起始占位内容', name: 'startplaceholder' }},
            { type: Input, option: { label: '结束占位内容', name: 'endplaceholder' }},
            { type: Switch, option: { label: '是否必填', name: 'required', value: false, activetext: '是', inactivetext: '否' }},
            { type: Switch, option: { label: '是否禁用', name: 'disabled', value: false, activetext: '是', inactivetext: '否' }},
            { type: Input, option: { label: '非空提示', name: 'requiredErrorMsg', value: '必填选项不能为空', description: '当必填选项为空时的提示' }},
            { type: Input, option: { label: '底部提示', name: 'description', description: '在组件此处显示' }}
          ]
        },
        {
          title: '附加配置', fields: [
            {
              type: Select, option: {
                label: '显示形式',
                name: 'format',
                list: [
                  { name: 'yyyy-MM-dd HH:mm:ss', value: 'yyyy-MM-dd HH:mm:ss' },
                  { name: 'yyyy年MM月dd日 HH时mm分ss秒', value: 'yyyy年MM月dd日 HH时mm分ss秒' }
                ],
                value: 'yyyy-MM-dd HH:mm:ss'
              }
            },
            { type: Switch, option: { label: '是否开启日期限制', name: 'rangeOpen', value: false, activetext: '是', inactivetext: '否' }},
            { type: DateTime, option: { label: '起始日期', name: 'rangeBefore', description: '该日期前不可用' }},
            { type: DateTime, option: { label: '结束日期', name: 'rangeAfter', description: '该日期后不可用' }}
          ]
        }
      ],
      valueType: Types.VALUETYPES.RANGEDATETIME,
      format(a) {
        if (a) {
          const [s, e] = a
          return `${formatDate(new Date(+s), `yyyy-MM-dd HH:mm:ss`)} ~ ${formatDate(new Date(+e), `yyyy-MM-dd HH:mm:ss`)}`
        } else {
          return '--'
        }
      }
    }
  },
  time() {
    return {
      target: Time,
      parameter: {
        mold: 'field',
        label: '时间',
        placeholder: '时间',
        value: ''
      },
      option: [
        { title: '基础配置', fields: BasicOption() },
        {
          title: '附加配置', fields: [
            {
              type: Select, option: {
                label: '显示形式',
                name: 'format',
                list: [
                  { name: 'HH:mm:ss', value: 'HH:mm:ss' },
                  { name: 'HH时mm分ss秒', value: 'HH时mm分ss秒' }
                ],
                value: 'HH:mm:ss'
              }
            },
            { type: Switch, option: { label: '是否开启时间限制', name: 'rangeOpen', value: false, activetext: '是', inactivetext: '否' }},
            { type: Time, option: { label: '起始时间', name: 'rangeBefore', description: '该时间前不可用' }},
            { type: Time, option: { label: '结束时间', name: 'rangeAfter', description: '该时间后不可用' }}
          ]
        }
      ],
      valueType: Types.VALUETYPES.TIME,
      format(a) {
        return a
      }
    }
  },
  notes() {
    return {
      target: Notes,
      parameter: {
        mold: 'view',
        label: '备注',
        content: ''
      },
      option: [
        {
          title: '基础配置', fields: [
            { type: Input, option: { label: '备注', name: 'label' }},
            { type: Input, option: { label: '备注内容', name: 'content', type: 'textarea' }}
          ]
        }
      ]
    }
  },
  line() {
    return {
      target: Line,
      parameter: {
        mold: 'view',
        label: '分割线'
      },
      option: [
        {
          title: '基础配置', fields: [
            { type: Input, option: { label: '备注', name: 'label' }}
          ]
        }
      ]
    }
  },
  drawboard() {
    return {
      target: Drawboard,
      parameter: {
        mold: 'field',
        label: '签名'
      },
      option: [
        { title: '基础配置', fields: BasicOption() }
      ],
      valueType: Types.VALUETYPES.URL,
      format(a) {
        return `<img src="${a}">`
      }
    }
  },
  editor() {
    return {
      target: Editor,
      parameter: {
        mold: 'field',
        label: '富文本',
        placeholder: '请输入正文'
      },
      option: [
        { title: '基础配置', fields: BasicOption() }
      ],
      valueType: Types.VALUETYPES.STRING,
      format(a) {
        return a.substring(0, 20) + '....'
      }
    }
  },
  uploadfile() {
    return {
      target: UploadFile,
      parameter: {
        mold: 'field',
        label: '单文件上传',
        autoupload: true
      },
      option: [
        { title: '基础配置', fields: BasicOption() },
        {
          title: '附加配置', fields: [
            { type: Input, option: { label: '文件类型', name: 'accept', value: '', description: '举例：限制为xlsx文件，则输入.xlsx。多个请用,分隔。为空则视为不限制文件类型。' }},
            { type: InputNumber, option: { label: '文件大小限制(MB)', name: 'maxSize', value: 5, max: 200, min: 0, percision: 2 }}
          ]
        }
      ],
      valueType: Types.VALUETYPES.URL
    }
  },
  uploadfiles() {
    return {
      target: UploadFiles,
      parameter: {
        mold: 'field',
        label: '多文件上传'
      },
      option: [
        { title: '基础配置', fields: BasicOption() },
        {
          title: '附加配置', fields: [
            { type: Input, option: { label: '文件类型', name: 'accept', value: '', description: '举例：限制为xlsx文件，则输入.xlsx。多个请用,分隔。为空则视为不限制文件类型。' }},
            { type: InputNumber, option: { label: '单文件大小限制(MB)', name: 'maxSize', value: 5, max: 99999, min: 0, percision: 2 }},
            { type: InputNumber, option: { label: '文件数量限制', name: 'limit', value: 1, max: 200, min: 1, percision: 0 }},
            {
              type: Select, option: {
                label: '文件列表的类型',
                name: 'listtype',
                list: [
                  { name: 'text', value: 'text' },
                  { name: 'picture', value: 'picture' }
                ],
                value: 'text'
              }
            }
          ]
        }
      ],
      valueType: Types.VALUETYPES.ENUMURL
    }
  },
  uploadimage() {
    return {
      target: UploadImage,
      parameter: {
        mold: 'field',
        label: '单图片上传',
        maxSize: 5
      },
      option: [
        { title: '基础配置', fields: BasicOption() },
        {
          title: '附加配置', fields: [
            { type: InputNumber, option: { label: '文件大小限制(MB)', name: 'maxSize', value: 5, max: 200, min: 0, percision: 2 }}
          ]
        }
      ],
      valueType: Types.VALUETYPES.IMAGE,
      format(a) {
        return `<img src="${a}">`
      }
    }
  },
  area() {
    return {
      target: Area,
      parameter: {
        mold: 'field',
        label: '地区',
        placeholder: '地区'
      },
      option: [
        { title: '基础配置', fields: BasicOption() }
      ],
      valueType: Types.VALUETYPES.AREA,
      format(a) {
        return a
      }
    }
  },
  address() {
    return {
      target: Address,
      parameter: {
        mold: 'field',
        label: '地址',
        placeholder: '地址'
      },
      option: [
        { title: '基础配置', fields: BasicOption() }
      ],
      valueType: Types.VALUETYPES.ADDRESS,
      format(a) {
        return a
      }
    }
  },
  color() {
    return {
      target: Color,
      parameter: {
        mold: 'field',
        label: '颜色',
        placeholder: '颜色'
      },
      option: [
        { title: '基础配置', fields: BasicOption() }
      ]
    }
  },
  slider() {
    return {
      target: Slider,
      parameter: {
        mold: 'field',
        label: '滑块',
        placeholder: '滑块'
      },
      option: [
        { title: '基础配置', fields: BasicOption() }
      ]
    }
  },
  link() {
    return {
      target: Link,
      parameter: {
        mold: 'field',
        label: '链接',
        placeholder: '链接'
      },
      option: [
        { title: '基础配置', fields: BasicOption() }
      ]
    }
  }
}

const FieldsMap = {
  Fields,
  Types,
  VALUETYPES: Types.VALUETYPES,
  OPERATES: Types.OPERATES,
  invokeOperate({ operate, rvalue, rvalueType, lvalue, lvalueType, data }) {
    return Types.invokeOperate({ operate, rvalue, rvalueType, lvalue, lvalueType, data })
  },
  getField(name) {
    const t = Fields[name]
    if (t) {
      const info = t(); let parameter = {}
      if (info.defaultOption) {
        parameter = Object.assign({}, info.parameter, info.defaultOption(info))
      } else {
        parameter = info.parameter
      }
      return { ...info, parameter, name }
    }
    return null
  },

  getFieldOperators(name) {
    const t = Fields[name]
    if (t) {
      return Types.getTypeOperators(t().valueType)
    }
  },

  getFieldOptionForm(name, values, env) {
    const t = this.getField(name)
    if (t) {
      return (t.option || []).map(info => {
        let { title, fields } = info
        if (typeof fields === 'function') {
          fields = fields(env)
        }
        fields = fields.map(({ type, option }) => {
          if (values.hasOwnProperty(option.name)) {
            option.value = values[option.name]
          }
          return { type, option }
        })
        return { title, fields }
      })
    }
    return null
  }
}

export default FieldsMap
